<template>
    <div class="box">
        <avue-crud ref="crud"
                   v-model="form"
                   :page="page"
                   :data="tableData"
                   :table-loading="tableLoading"
                   :option="tableOption"
                   @on-load="getList"
                   @search-change="searchChange"
                   @refresh-change="refreshChange"
                   @size-change="sizeChange"
                   @current-change="currentChange"
                   @row-update="handleUpdate"
                   @row-save="handleSave"
                   @row-del="rowDel">
            <template slot="menu" slot-scope="scope">
                <el-button :size="scope.size" icon="el-icon-refresh"
                           @click="$refs.merchantsInfo.openDia(scope.row)" type="text">查看
                </el-button>
                <el-button v-if="buttonPermissionsCheck('SYS_USER_RESET_PASSWORD')" :size="scope.size"
                           icon="el-icon-refresh"
                           @click="resetPassword(scope.row)" type="text">重置密码
                </el-button>
            </template>
            <template slot="state" slot-scope="scope">
                <el-switch
                        style="display: block"
                        @change="change(scope.row)"
                        v-model="scope.row.state"
                        active-color="#13ce66"
                        inactive-color="#ff4949"
                        active-text="启用"
                        inactive-text="禁用"
                        active-value="01"
                        inactive-value="02">
                </el-switch>
            </template>
        </avue-crud>
        <merchantsInfo ref="merchantsInfo"></merchantsInfo>
    </div>
</template>

<script>
    import {tableOption} from '@/js/sys/user/list.js'
    import tableMixins from "@/mixins/tableMixins.vue"

    export default {
        name: "list",
        mixins: [tableMixins],
        components: {
            'merchantsInfo': () => import('@/components/merchants/info.vue')
        },
        data() {
            return {
                //访问接口前缀
                url: "info-merchants",
                // 表格参数
                tableOption: {
                    border: true,
                    index: true,
                    indexLabel: '序号',
                    indexWidth: 50,
                    stripe: true,
                    align: 'center',
                    searchMenuSpan: 6,
                    labelWidth: 120,
                    height: '600px',
                    calcHeight: 400,
                    dialogWidth: 900,
                    menuWidth: 300,
                    addBtn: false,
                    editBtn: false,
                    menuAlign: 'center',
                    column: [
                        {
                            prop: 'id',
                            label: 'ID',
                            hide: true,
                            addDisplay: false,
                            editDisplay: false
                        }, {
                            prop: 'username',
                            label: '账号',
                            type: 'input',
                            overHidden: true,
                            minWidth: 60,
                            search: true,
                        },
                        {
                            prop: 'name',
                            label: '店铺名',
                            type: 'input',
                            overHidden: true,
                            minWidth: 60,
                            search: true,
                        },
                        {
                            prop: 'contact',
                            label: '联系人',
                            type: 'input',
                            overHidden: true,
                            minWidth: 60,
                            search: true,
                        },
                        {
                            prop: 'contactPhone',
                            label: '联系电话',
                            type: 'input',
                            overHidden: true,
                            minWidth: 60,
                        },
                        {
                            prop: 'inCity',
                            label: '入驻城市',
                            type: 'select',
                            slot: true,
                            overHidden: true,
                            dicUrl: "/common/getItem/online_area",
                        }, {
                            prop: 'state',
                            label: '是否启用',
                            type: 'select',
                            slot: true,
                            overHidden: true,
                            dicUrl: "/common/getItem/state",
                        },
                    ]
                },
                //弹框显示判断
                dialogVisible: false,
            }
        },
        created() {

        },
        methods: {
            //修改用户状态
            change(row) {
                this.$HttpService.post("/sys-user/updateState/" + row.userId + "/" + row.state).then(res => {
                    this.getList();
                }).cache(() => {
                    this.getList();
                })
            },

            //重置密码
            resetPassword(row) {

                this.$confirm('是否确认重置密码？', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    this.$HttpService.post("/sys-user/resetPassword/" + row.userId).then(res => {
                        this.$message.success("操作成功！");
                    })
                })
            },

        }
    }
</script>

<style scoped>

</style>
